<!DOCTYPE html>
<html>
    <head>
        <title>Rblog login</title>
        <meta charset="UTF-8">
        <link rel="stylesheet" href="{$host}/statics/style/bootstrap/css/bootstrap.min.css" />
        <link rel="stylesheet" href="{$host}/statics/style/log.css" />
        <script src="{$host}/statics/js/jquery-1.11.3.js"></script>
        <script src="{$host}/statics/style/bootstrap/js/bootstrap.js"></script>
    </head>
    <body>
        <div class="container">
            <div class="blog-title-border">
               <span class="blog-title"><img src="{$host}/statics/img/logo.png" /></span>
            </div>
            <div class="form-border">
                <form class="form-horizontal" method="post">
                    <div class="form-group">
                        <label for="inputEmail3" class="col-sm-2 control-label log-label">用户名</label>
                        <div class="col-sm-10 log-input">
                            <input type="text" name="name" class="form-control" id="inputEmail3" placeholder="用户名" value="rexzy">
                            <span class="glyphicon glyphicon-user log-icon" aria-hidden="true"></span>
                            <div class="error-message">
                                <p></p>
                                <i class="error-icon"></i> 
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="inputPassword3" class="col-sm-2 control-label log-label">密码</label>
                        <div class="col-sm-10 log-input">
                            <input type="password" name="password" class="form-control" id="inputPassword3" placeholder="密码" value="123456">
                            <span class="glyphicon glyphicon-lock log-icon" aria-hidden="true"></span>
                            <div class="error-message">
                                <p></p>
                                <i class="error-icon"></i> 
                            </div>
                        </div>
                    </div>
                    <div class="form-group ">
                        <label for="verify-code" class="col-sm-2 control-label log-label">验证码</label>
                        <div class="col-sm-10 log-input">
                            <img src="{\Rexzy::url('user/verifycode')}" class='verify-img'/>
                            <input type="text" name="verifyCode" class="form-control" id="verify_code" placeholder="验证码">
                            <span class="glyphicon glyphicon-bookmark log-icon" aria-hidden="true"></span>
                            <div class="error-message">
                                <p></p>
                                <i class="error-icon"></i> 
                            </div>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-10 log-center">
                            <button type="submit" class="btn btn-default log-button">登录</button>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="col-sm-offset-2 col-sm-10 log-center">
                            <div class="checkbox">
                                <label>
                                    <input type="checkbox"> 记住我
                                </label>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        
        <script>
            {if isset($error)} {/php}
                var error = "{$error}";
                if ( error == '用户名不存在' || error == '请输入用户名' ) {
                    $(".error-message:eq(0) > p").append(error);
                    $(".error-message:eq(0)").css("display", "table");
                } else if ( error == '请输入密码' || error == '密码不符' ) {
                    $(".error-message:eq(1) > p").append(error);
                    $(".error-message:eq(1)").css("display", "table");
                } else if ( error == '验证码不正确' ) {
                    $(".error-message:eq(2) > p").append(error);
                    $(".error-message:eq(2)").css("display", "table");
                }
            {php}{/if}
                
            $(function() {
                var url = $(".verify-img").attr( 'src' );
                $(".verify-img").click( function() {
                    $(this).attr( 'src', url + '?random=' + Math.random() );
                });
            });
        </script>
    </body>
</html>
